<template>
    <section>
    <el-col :sm="24" :lg="16">
        <div class="grid-content bg-purple" :style="{backgroundColor:titleColor}">
            <div class="dev-title">告警声开关管理</div>
        </div>
        <div class="col-bg clearfix">
            <el-form ref="form" :model="form" label-width="150px" @submit.prevent="onSubmit" style="margin:20px;width:60%;min-width:600px;">
                <el-form-item label="全关/全开">
                    <el-switch v-model="allform" :active-color="theme" @change="onSubmit1()" :disabled="menubt.indexOf('alarm_switch/open_or_close')==-1" >
                    </el-switch>
                </el-form-item>
                <el-form-item label="事件告警">
                    <el-switch v-model="form.eventState" :active-color="theme" active-value="0" inactive-value="1" @change="onSubmit()" :disabled="menubt.indexOf('alarm_switch/open_or_close')==-1">
                    </el-switch>
                </el-form-item>
                <el-form-item label="一般告警">
                    <el-switch v-model="form.generalState" :active-color="theme" active-value="0" inactive-value="1" @change="onSubmit()" :disabled="menubt.indexOf('alarm_switch/open_or_close')==-1">
                    </el-switch>
                </el-form-item>
                <el-form-item label="重要告警">
                    <el-switch v-model="form.importantState" :active-color="theme" active-value="0" inactive-value="1" @change="onSubmit()" :disabled="menubt.indexOf('alarm_switch/open_or_close')==-1">
                    </el-switch>
                </el-form-item>
                <el-form-item label="严重告警">
                    <el-switch v-model="form.urgencyState" :active-color="theme" active-value="0" inactive-value="1" @change="onSubmit()" :disabled="menubt.indexOf('alarm_switch/open_or_close')==-1">
                    </el-switch>
                </el-form-item>

            </el-form>
        </div>
    </el-col>
    </section>
</template>

<script>
    import {
        alarm_switch_my,
        alarm_switch_open_or_close,


    } from '../../api/api';
    export default {
        data() {
            return {
                editLoading: false,
                allform: false,
                form: {
                    // userName: '',
                    // phone: '',
                    // email: '',
                    // weixin: '',
                    // address: '',
                    // remark: ''
                },
                edituser: {
                    userName: [{
                        required: true,
                        message: '请输入姓名',
                        trigger: 'blur'
                    },{ min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'blur' }],
                    phone: [{
                        required: true,
                        message: '请输入电话号码',
                        trigger: 'blur'
                    }],
                    email: [{
                        required: true,
                        message: '请输入邮箱',
                        trigger: 'blur'
                    }],

                }
            }
        },
        computed:{
            theme(){
				return this.$store.state.theme
			},
            titleColor(){
                return this.$store.state.titleColor
            },
            dialogTitleColor(){
                return this.$store.state.dialogTitleColor
            },
        },
        methods: {
            getUsers() {
            
                alarm_switch_my().then((res) => {
                    if (res.code == 0) {
                        this.editLoading = false;
                        //NProgress.done();
                        res.data.eventState = res.data.eventState.toString();
                        res.data.generalState = res.data.generalState.toString();
                        res.data.importantState = res.data.importantState.toString();
                        res.data.urgencyState = res.data.urgencyState.toString();
                        this.form = res.data;
                        if (res.data.eventState == 0 && res.data.generalState == 0 && res.data.importantState ==
                            0 && res.data.urgencyState == 0) {
                            this.allform = true;
                        } else {

                            this.allform = false;
                        }

                    }
                });
            },
            onSubmit1() {
               if(this.allform){
                this.form.eventState = 0;
                this.form.generalState = 0;
                this.form.importantState = 0;
                this.form.urgencyState = 0;
               }else{
                this.form.eventState = 1;
                this.form.generalState = 1;
                this.form.importantState = 1;
                this.form.urgencyState =1;
               }
               this.onSubmit();
            },
            onSubmit() {
                this.editLoading = true;
                //NProgress.start();
                let para = Object.assign({}, this.form);
                alarm_switch_open_or_close(para).then((res) => {
                    if (res.code == 0) {
                        this.editLoading = false;
                        //NProgress.done();
                        this.$message({
                            message: '提交成功',
                            type: 'success'
                        });

                        this.getUsers();
                    }
                });
            }
        },
        mounted() {
            this.menubt=localStorage.getItem('menubt');
            this.getUsers();
        }
    }
</script>